﻿<div class="row">
    <div class="col-xs-12">
        <label class="wb-label" for="cb-categorical-kind" ng-i18next="QuestionDisplayMode"></label>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <div class="dropdown-with-breadcrumbs-and-icons">
            <div class="btn-group" uib-dropdown>
                <button class="btn dropdown-toggle" id="cb-categorical-kind" uib-dropdown-toggle type="button">
                    {{ getCategoricalSingleDisplayMode() }}
                    <span class="dropdown-arrow"></span>
                </button>

                <ul class="dropdown-menu" role="menu">
                    <li role="presentation">
                        <a role="menuitem" tabindex="-1" ng-i18next="QuestionRadioButtonList" ng-click="setQuestionAsRadioButtons()"></a>
                    </li>
                    <li role="presentation">
                        <a role="menuitem" tabindex="-1" ng-i18next="QuestionComboBox" ng-click="setQuestionAsCombobox()"></a>
                    </li>
                    <li role="presentation">
                        <a role="menuitem" tabindex="-1" ng-i18next="QuestionCascading" ng-click="setQuestionAsCascading()"></a>
                    </li>
                </ul>
            </div>
        </div>
        <p></p>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <label class="wb-label" for="cb-categories-type" ng-i18next="SourceOfCategories"></label>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <div class="dropdown-with-breadcrumbs-and-icons">
            <div class="btn-group" uib-dropdown>
                <button class="btn dropdown-toggle" id="cb-categorical-type" uib-dropdown-toggle type="button">
                    {{ getSourceOfCategories() }}
                    <span class="dropdown-arrow"></span>
                </button>
                <ul class="dropdown-menu" role="menu">
                    <li role="presentation">
                        <a role="menuitem" tabindex="-1" ng-i18next="UserDefinedCategories" ng-click="setUserDefinedCategories()"></a>
                    </li>
                    <li role="presentation">
                        <a role="menuitem" tabindex="-1" ng-i18next="ReusableCategories" ng-click="setIsReusableCategories()"></a>
                    </li>
                    <li role="presentation">
                        <a role="menuitem" tabindex="-1" ng-i18next="RostersQuestion" ng-if="!activeQuestion.isCascade" ng-click="setIsLinkedQuestion()"></a>
                    </li>
                </ul>
            </div>
        </div>
        <p></p>
    </div>
</div>
<div class="row" ng-if="!activeQuestion.isFilteredCombobox && !activeQuestion.isLinked && !activeQuestion.isCascade  && !activeQuestion.isLinkedToReusableCategories">
    <div class="col-xs-12">
        <div class="well well-sm" ng-if="activeQuestion.wereOptionsTruncated" ng-i18next="({count: 200})QuestionOptionsCut"></div>
        <ng-include src="'views/question-details/OptionsEditor-template.html'"></ng-include>
        <p></p>
    </div>
</div>


<div class="row" ng-if="activeQuestion.isLinkedToReusableCategories === true">
    <div class="col-xs-12">
        <label class="wb-label" for="cb-categories" ng-i18next="BindToReusableCategories"></label>
    </div>
</div>
<div class="row" ng-if="activeQuestion.isLinkedToReusableCategories === true">
    <div class="col-xs-12">
        <div class="dropdown-with-breadcrumbs-and-icons">
            <div class="btn-group" uib-dropdown>
                <button class="btn dropdown-toggle" uib-dropdown-toggle id="cb-categories" type="button">
                    <span class="select-placeholder" ng-if="(activeQuestion.categoriesId || '') == ''" ng-i18next="SelectCategories"></span>
                    <span class="selected-item" ng-if="(activeQuestion.categoriesId || '') !== ''">
                        {{ getSelectedCategories().name }}
                    </span>
                    <span class="dropdown-arrow"></span>
                </button>

                <ul class="dropdown-menu" role="menu">
                    <li role="presentation" ng-repeat="categories in getCategoriesList()">
                        <a ng-click="setCategories(categories)"
                           role="menuitem"
                           tabindex="-1"
                           class="linked-question-source"
                           href="javascript:void(0);">
                            <div>
                                <span ng-bind="categories.name | escape"></span>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
        <p></p>
    </div>
</div>
<p></p>
<div class="row" ng-if="activeQuestion.isFilteredCombobox && !activeQuestion.isCascade && !activeQuestion.isLinkedToReusableCategories && !activeQuestion.isLinked">
    <div class="col-xs-12">
        <a href="javascript:void(0);"
           class="btn btn-link upload-categories-button"
           ng-click="editFilteredComboboxOptions()" ng-i18next="QuestionUploadOptions">
        </a>
        <a href="javascript:void(0);"
           class="btn btn-link"
           ng-click="showAddClassificationModal()" ng-i18next="QuestionAddClassification">
        </a>
        <p></p>
    </div>
</div>
<div class="row" ng-if="activeQuestion.isLinked">
    <div class="col-xs-12">
        <div class="form-group" ng-include="'linkTemplate.html'" ng-class="{'has-error': !questionForm.linkedToEntity.$valid}"></div>
        <p></p>
    </div>
</div>
<div class="row">
    <div class="col-xs-12">
        <ng-include src="'categorical-filter-expression'"></ng-include>
    </div>
</div>
<div class="row" ng-if="activeQuestion.isCascade">
    <div class="col-xs-12">
        <div class="form-group" ng-include="'views/question-details/CascadingComboBox-Template.html'"></div>
        <p></p>
    </div>
</div>
<div class="row" ng-if="activeQuestion.isCascade && (activeQuestion.cascadeFromQuestionId || '') !== '' && !activeQuestion.isLinkedToReusableCategories">
    <div class="col-xs-12">
        <a href="javascript:void(0);"
           class="btn btn-link"
           ng-click="editCascadingComboboxOptions()" ng-i18next="QuestionUploadOptions">
        </a>
        <p></p>
    </div>
</div>
